<template>
  <div class="main">
    <div class="table">
      <div class="title">我要请假</div>
      <div class="form">
        <div class="item">
          <div class="lable">时间段选择</div>
          <el-date-picker
            v-model="value1"
            type="datetimerange"
            range-separator="至"
            start-placeholder="开始时间"
            end-placeholder="结束时间"
          />
        </div>
        <div class="item">
          <div class="lable">请假原因</div>
          <el-input v-model="desc" type="textarea" />
        </div>
      </div>
      <div class="submit" @click="toSubmit">提交</div>
    </div>
  </div>
</template>
<script>
import { community } from "@/api/apiData";
export default {
  data() {
    return {
      value1: "",
      desc: "",
    };
  },
  mounted() {},
  methods: {
    toSubmit() {
      console.log(this.value1);
      console.log(this.desc);
    },
  },
};
</script>
<style lang="less" scoped>
.main {
  padding: 22px 500px 213px;
  .table {
    border-radius: 8px;
    background: white;
    padding-bottom: 30px;
    .title {
      background: linear-gradient(to right, #56abf9, #5686fc);
    }
    .form {
      padding: 34px 64px;
      .item {
        margin-bottom: 30px;
      }
      .lable {
        font-size: 30px;
        margin-bottom: 20px;
      }
    }
    .submit {
      background: #ff8c00;
      border-radius: 8px;
      color: white;
      text-align: center;
      font-size: 34px;
      width: 432px;
      line-height: 62px;
      margin: 49px auto;
    }
  }
}
</style>